import 'package:flutter/material.dart';

class MyApp10 extends StatelessWidget {
  const MyApp10({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      // 导航条
      appBar: AppBar(
        title: const Text('Expanded组件',
            style: TextStyle(color: Colors.white, fontSize: 20)),
        backgroundColor: Colors.pink,
        centerTitle: true,
      ),
      // 主体区域
      body: Center(
          child: Container(
        width: MediaQuery.of(context).size.width,
        height: 120,
        color: Colors.cyan,
        child: Row(
          children: [
            Expanded(
                flex: 2,
                child: Container(
                  height: 80,
                  color: Colors.red,
                  child: const Text('111'),
                )),
            Expanded(
                flex: 8,
                child: Container(
                  height: 80,
                  color: Colors.green,
                  child: const Text('2222 2222 2222 22222222 2222'),
                )),
            Expanded(
                flex: 1,
                child: Container(
                  height: 80,
                  color: Colors.pink,
                  child: const Text('3333'),
                ))
          ],
        ),
      )),
    );
  }
}
